JSC : A JavaScript Object System

The JSC language is a superset of JavaScript designed to ease the development of large web applications. This language extends JavaScript’s own object system by isolating code in a class declaration, simplifying multiple inheritance and using method implementation agreements. 1 Motivation As web applications have been gaining more dynamic behavior, JavaScript has become more important in web development. As such, it is useful to use a software engineering aproach to JavaScript. JavaScript object-oriented model is prototype-based. This model can be extremely versatile to develop. However, in a large team of developers, not only problems such as name colisions and unintentional method redefinition can occur, but also maintenance becomes an issue. JSC attempts to remedy some of these issues by implementing a Object System on top of standard JavaScript. 2 Related Work There have been some attemps to add structed programming to Javascript. In ECMAScript (language from witch JavaScript is a dialect) last version were added support for defining classes. Another dialect of ECMAScript, ActionScript supports defining classes. Althought those systems are more advanced (they support typechecking via anotation on variables, generics, dynamic classes, templates, etc.), they aren’t avaible in the current browsers. It’s expected that future versions of JavaScript extends this behavior from ECMAScript. Other attempt have been creating creating supersets to JavaScript. One example of this is Objective-J. This is a sctrict superspet of Javascript, but adds a object system by implementing a language similar to Objective-C. This aproach is similar to JSC, but this language uses the same message passing than Objective-C making the methods unparsable by JavaScript. 1 ar X iv :0 91 2. 28 61 v1 [ cs .P L ] 1 5 D ec 2 00 9 3 Object Oriented JavaScript In JavaScript, a class is a function, so its definition is similar to the definition of a function, as shown next: 1 function Rectangle(w, h) { 2 this.width = w; 3 this.height = h; 4 } A function in javascript is of type Function but behaves similarly to a hash or a dictionary. One of the properties in this object is the prototype. This property represents a structure that is not yet fully defined and it is only formed when it is instantiated. Instantiation can be done by: new Rectangle(10,10); new operator will invoke the function Rectangle with this as a new object with a reference to Rectangle.prototype, and return this object.Any changes made to this object will only afect the new object, and not the prototype. If a property is not defined in the object but on the prototype, then the prototype’s value is returned. A method can be defined by adding a function to the class prototype as shown next: 1 Rectangle.prototype.getArea = function (){ 2 return this.height * this.width; 3 } Methods are called like this: rectangle.getHeight() As with the constructor, getHeight will be invoked with this as a reference to the instance, in this case to rectangle. This method will be avaible to all instances that don’t define localy the method getArea. The code below shows how inheritance is implemented: by copying the prototype of the superclass to the subclass. 1 function PositionedRectangle(x, y, w, h) { 2 Rectangle.call(this, w, h); 3 4 this.x = x; 5 this.y = y; 6 } 7 PositionedRectangle.prototype = new Rectangle(); 1Actually Rectangle could return anything, but the default is this